import React, { Component } from 'react'
import { NavBar, Icon } from 'antd-mobile'
import { withRouter } from 'react-router-dom'
import PropTypes from 'prop-types'
import './index.scss'
class NavHeader extends Component {
  // 自定义左侧图标功能
  onLeftClick = () => {
    const { onLeftClick } = this.props
    if (onLeftClick) return onLeftClick()
    this.props.history.go(-1)
  }

  render() {
    const { children } = this.props
    return (
      <NavBar
        mode="dark"
        icon={<Icon type="left" />}
        className="page-nav-bar"
        onLeftClick={this.onLeftClick}
      >
        {children}
      </NavBar>
    )
  }
}

NavHeader.propTypes = {
  children: PropTypes.string.isRequired,
  onLeftClick: PropTypes.func,
}

export default withRouter(NavHeader)
